.g__navbar{
    @include size(100%,4rem);
    background-color: $body-background;
    position: relative;
    user-select: none;
    text-align: center;
    line-height: 4rem;
    display: flex;
    
    &:after{
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        border-bottom: $border-width-default $border-style-default $border-color-base;
        transform: scaleY(.5);
        transform-origin: 0 0;
    }

    & .g__navbar--left,
    & .g__navbar--right {
        font-size: $font-size-base;
        // min-width: 3.5rem;
    }

    & .g__navbar--left {
        
        & .g__navbar--icon{
            margin-left: 5px;
        }
    }

    & .g__navbar--right {

        & .g__navbar--icon{
            margin-right: 5px;
            font-size: 1.8rem;
        }
    }

    & .g__navbar--title {
        font-size: 1.4rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        flex: 1;
        color: #555;
        margin: 0 20px;

        & img{
            max-height: 3.5rem;
            height: 3.5rem;
            vertical-align: middle;
        }
    }
}



